<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" > 

<html>
<head>
<base href="<%=basePath%>">
<title>部位列表</title>
<link rel="stylesheet" type="text/css" href="./js/bootstrap-3.3.5-dist/css/bootstrap.css" />
<link href="./js/metisMenu/metisMenu.min.css" rel="stylesheet">
<link href="./css/sb-admin/sb-admin-2.css" rel="stylesheet">
<link rel="stylesheet" href="./js/font-awesome/css/font-awesome.min.css">
<link href="./css/base.css" rel="stylesheet">
<link rel="stylesheet" href="./js/bootstrap-table/bootstrap-table.min.css">
<link rel="stylesheet" href="./js/bootstrap-multiselect/bootstrap-multiselect.css"/>
<link rel="stylesheet" href="./js/bootstrap-3.3.5-dist/css/bootstrap-datetimepicker.css">
<script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="./js/bootstrap-3.3.5-dist/js/bootstrap.js"></script>
<script src="./js/bootstrap-table/bootstrap-table-all.js"></script>
<script src="./js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" src="./js/metisMenu/metisMenu.js"></script>
<script src="./js/bootstrap-multiselect/bootstrap-multiselect.js"></script>
<script src="./js/bootstrap-3.3.5-dist/js/bootstrap-datetimepicker.js"></script>
<script src="./js/bootstrap-3.3.5-dist/js/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="./js/bootstrap-jquery-plugin/jquery.bootstrap.js"></script>
<script type="text/javascript" src="./js/common.js"></script>
<script type="text/javascript" src="./js/xss.js"></script>
</head>
<body>
<jsp:include page="../template/head.jsp" />
<jsp:include page="../template/leftnav.jsp" />
<div id="page-wrapper">
	<div>
		<h1>部位列表</h1>
	</div>
	<div class="content">
		<form class="form-inline">
			<div class="form-group">
				<label for="onePart">一级部位：</label>
				<input type="text" id="onePart" class="form-control" placeholder="请输入一级部位" onkeyup="filters(this)" onchange="filters(this)">
			</div>
			<div class="form-group">
				<label for="twoPart">二级部位：</label>
				<input type="text" id="twoPart" class="form-control" placeholder="请输入二级部位" onkeyup="filters(this)" onchange="filters(this)">
			</div>
			<div class="form-group">
				<button class="btn  search-btn" id="search">搜索</button>
				<button id="create" class="btn">新增</button>
				<button id="reset" class="btn btn-default">重置</button>
			</div>
		</form>
		 <table id="table" data-toolbar="#toolbar" data-toggle="table" data-row-style="rowStyle" data-classes="table  table-no-bordered"
	           data-minimum-count-columns="2"  data-cache="false" data-pagination="true"  data-striped="data-striped"
	           data-page-list="[5, 10, 20, 50]"  data-query-params="tableQueryParams" style="word-break:break-all;"
	           data-side-pagination="server" data-page-size=10 >
	           <thead>
				<tr class="headTr">
					<th data-field="oneNum" data-width="20%" >一级序号</th>
					<th data-field="onePart" data-width="20%" >一级部位</th>
					<th data-field="twoNum" data-width="20%" >二级序号</th>
					<th data-field="twoPart" data-width="20%" >二级部位</th>
					<th data-field="operation" data-width ="20%" data-formatter="operFormatter">操作</th>
				</tr>
			</thead>
	    </table>
	    <div id="adminperTemp" style="display:none">
			<ul class="list-inline">
				<li role="presentation"><a class="btn btn-primary">编辑</a></li>
				<li role="presentation"><a class="btn btn-danger">删除</a></li>
			</ul>
		</div>
    </div>
</div>
<div id="createwrap" style="display:none">
  <form id="createform" role="form" class="form-horizontal">
    <div class="form-group">
       	<label for="oneNum1" class="col-sm-3 control-label">一级序号:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="oneNum1" placeholder="一级序号" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
    	<br>
    	<label for="onePart1" class="col-sm-3 control-label">一级部位:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="onePart1" placeholder="一级部位" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
    	<br>
    	
    	<label for="twoNum1" class="col-sm-3 control-label">二级序号:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="twoNum1" placeholder="二级序号" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
    	<br>
    	<label for="occupation" class="col-sm-3 control-label">二级部位:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="twoPart1" placeholder="请输入二级部位" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
    </div>
</div>

<div id="eidtwrap" style="display:none">
  <form id="editform" role="form" class="form-horizontal">
    <div class="form-group">
        <label for="oneNum2" class="col-sm-3 control-label">一级序号:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="oneNum2" placeholder="一级序号" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
    	<br>
    	<label for="adminName2" class="col-sm-3 control-label" style="margin-top:5px">一级部位:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="onePart2" placeholder="请输入一级部位" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
    	<br>
    	
    	<label for="twoNum2" class="col-sm-3 control-label">二级序号:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="twoNum2" placeholder="二级序号" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
    	<br>
    	<label for="occupation2" class="col-sm-3 control-label" style="margin-top:5px">二级部位:</label>
    	<div class="col-sm-8">
      		<input class="form-control" id="twoPart2" placeholder="请输入二级部位" onkeyup="filters(this)" onchange="filters(this)"/>
    	</div>
    	<br>
        <br>
    </div>
</div>

<script>

$(function () {
	
	"use strict";
	
	$('#table').bootstrapTable('refresh', {
		query : {
			offset: 0
		},
		url : "./part/queryAllPartGroups",
		silent : true
	});

	$('#search').on('click', function (e) {
		e.preventDefault();
		searchOrder();
	});
	
	$('#create').on('click', function (e) {
		e.preventDefault();
		createPart();
	});
	
	 $('#sexSel').multiselect({
	 	includeSelectAllOption: true,
	 	buttonWidth: '150px'
	 });
	
});

function tableQueryParams(params) {
	var queryObj = getQueryObject();
	var newParams = $.extend(params,queryObj);
	return newParams;
}
	
function getQueryObject(){
	var queryObj;
	var onePart = $("#onePart").val();
	var twoPart = $("#twoPart").val();
	
	var queryObj = {
		onePart : onePart,
		twoPart : twoPart
	}
	
	if(onePart ==""){
		delete queryObj.onePart;
	}
	
	if(twoPart ==""){
		delete queryObj.twoPart;
	}
	
	return queryObj;
}
	
function searchOrder(){
	var queryObj = getQueryObject();
	$('#table').bootstrapTable('refresh', {
		query : {
			offset: 0
		},
		url : "./part/queryAllPartGroups.spring",
		silent : true
	});
}

function operFormatter(value, row) {
	var operTemp = $("#adminperTemp").clone();
	var lis = operTemp.find("ul li");
	lis.eq(0).find("a").attr("onClick", "editPart(\""
		+row.id+"\",\""
		+row.onePart+"\",\""
		+row.oneNum+"\",\""
		+row.twoNum+"\",\""
		+row.twoPart+"\")");
	lis.eq(1).find("a").attr("onClick", "deletePart(\""+row.id+"\")");
	return operTemp.html();
}

function deletePart(id){
	$.messager.model = { 
		//定义消息提示框
	   	ok:{ text: "确定", classed: 'btn btn-success' },
	    cancel:{text:"取消",classed: 'btn btn-error' }
	};
	$.messager.confirm("温馨提示", "确定删除?", function(){
		$.ajax({
			url: "./part/deletePart",
			data:{
				id	: id
			},
			type: "GET",
			dataType: 'json',
			cache: false,
			success: function(ret) {
				$.messager.popup(ret.msg);
				if(ret.resultCode==0){
					$('#table').bootstrapTable('refresh', {
						query : {
							offset: 0
						},
						silent : true
					});
				}
			}
		});
	});
}

function editPart(id,onePart2,oneNum,twoNum,twoPart2){
   	$("#eidtwrap").show();
   	$("#onePart2").val(onePart2);
   	$("#twoPart2").val(twoPart2);
   	$("#oneNum2").val(oneNum);
    $("#twoNum2").val(twoNum);
	$("#eidtwrap").dialog({
         	title   : "编辑部位",
        	'class' :  "mydialog",
        	onClose : function() { 
         		 $(this).dialog("close");
         		 $("#onePart2").val('');
             	 $("#twoPart2").val('');
             	 $("#oneNum2").val('');
 				 $("#twoNum2").val('');
          	}, 
          	buttons : [{
          		text : "提交",
          		'class' : "btn btn-primary",
             	click : function() {
             		var onePart = $("#onePart2").val();
             	 	var twoPart = $("#twoPart2").val();
             	 	var oneNum = $("#oneNum2").val();
 				 	var twoNum = $("#twoNum2").val();
             		
                    $.ajax({
                     url: "./part/editPart",
                     data: {
                     	id :id,
                     	onePart :onePart,
						twoPart : twoPart,
						oneNum : oneNum,
						twoNum : twoNum
                     },
                     type: "POST",
                     dataType: 'json',
                     cache: false,
                     success: function (ret) {
                         if (ret.resultCode == 0) {
                             $.messager.popup(ret.msg);
                             $('#table').bootstrapTable('refresh', {
								query : {
									offset: 0
								},
								silent : true
							});
                            
                         }else{
                         	$.messager.popup(ret.msg);
                         }
                         $(this).dialog("close");
                     }
                 });
                 $(this).dialog("close");
                 $("#onePart2").val('');
             	 $("#twoPart2").val('');
             	 $("#oneNum2").val('');
 				 $("#twoNum2").val('');
             	}
             },{
             text : "关闭",
             'class' : "btn btn-default",
             click : function() {
                	 $(this).dialog("close");
                	 $("#onePart2").val('');
             	 	 $("#twoPart2").val('');
             	 	 $("#oneNum2").val('');
 				 	 $("#twoNum2").val('');
             	}
         }]
     });
}

function createPart(){
	$("#createwrap").show();
	$("#createwrap").dialog({
         	title   : "新增部位",
        	'class' :  "mydialog",
        	onClose : function() { 
         		 $(this).dialog("close");
         		 $("#onePart1").val('');
             	 $("#twoPart1").val('');
             	 $("#oneNum1").val('');
 				 $("#twoNum1").val('');
          	}, 
          	buttons : [{
          		text : "提交",
          		'class' : "btn btn-primary",
             	click : function() {
             		var onePart = $("#onePart1").val();
             		var twoPart = $("#twoPart1").val();
             		var oneNum = $("#oneNum1").val();
 				 	var twoNum = $("#twoNum1").val();
             		
                    $.ajax({
                     url: "./part/addPart",
                     data: {
						onePart : onePart,
						twoPart : twoPart,
						oneNum : oneNum,
						twoNum : twoNum
                     },
                     type: "POST",
                     dataType: 'json',
                     cache: false,
                     success: function (ret) {
                         if (ret.resultCode == 0) {
                             $.messager.popup("温馨提示:新增成功!");
                             $('#table').bootstrapTable('refresh', {
								query : {
									offset: 0
								},
								silent : true
							});
                            
                         }else{
                         	$.messager.popup("温馨提示:新增失败!");
                         }
                         $(this).dialog("close");
                     }
                 });
                 $(this).dialog("close");
                 $("#onePart1").val('');
             	 $("#twoPart1").val('');
             	 $("#oneNum1").val('');
 				 $("#twoNum1").val('');
             	}
             },{
             text : "关闭",
             'class' : "btn btn-default",
             click : function() {
               	 	$(this).dialog("close");
               	 	$("#onePart1").val('');
             	 	$("#twoPart1").val('');
             	 	$("#oneNum1").val('');
 				    $("#twoNum1").val('');
             	}
         }]
     });
}

</script>
</body>
</html>